import { BasicColumn, BasicTable, TableAction, useTable } from "@/components/Table";
import { useTranslation } from "react-i18next";
import { IconEnum } from "@/enums/appEnum";
import PatientInformation from "@/components/ViewComponents/PatientInformation";
import "./index.less";
import { chargeApi } from "@/api/MedicalExamination/outpatientExpenses/charge";
import { Tag } from "antd";
import { useEffect, useState } from "react";
import Details from "./components/details/index";
import { useDrawer } from "@/components/Drawer";
const index = () => {
	const { t } = useTranslation();
	const en_vi = "MedicalExamination.outpatientExpenses.charge";
	const [information, setInformation] = useState<any>({});
	const [data, setData] = useState<any>([]);
	const columns: BasicColumn[] = [
		{
			title: t(`${en_vi}.orderId`),
			dataIndex: "orderId"
		},
		{
			title: t(`${en_vi}.projectName`),
			dataIndex: "deptId"
		},

		{
			title: t(`${en_vi}.projectPriceYuan`),
			dataIndex: "bizPrice"
		},
		{
			title: t(`${en_vi}.discountAmountYuan`),
			dataIndex: "discountPrice"
		},
		{
			title: t(`${en_vi}.discountRatePercent`),
			dataIndex: "discountPercent"
		},
		{
			title: t(`${en_vi}.actualPaymentYuan`),
			dataIndex: "discountPercent",
			render: (_: any, record: any) => {
				return record.bizPrice - record.discountPrice;
			}
		},
		{
			title: t(`${en_vi}.state`),
			dataIndex: "status",
			render: (state: any) => {
				if (state == 0) return <Tag color="processing">{t(`${en_vi}.pendingPayment`)}</Tag>;
				if (state == 1) return <Tag color="success">{t(`${en_vi}.paid`)}</Tag>;
				if (state == 2) return <Tag color="error">{t(`${en_vi}.refunded`)}</Tag>;
				return "";
			}
		},
		{
			title: t(`${en_vi}.type`),
			dataIndex: "bizType",
			render: (bizType: any) => {
				if (bizType == 1) return t(`${en_vi}.inspection`);
				if (bizType == 2) return t(`${en_vi}.service`);
				if (bizType == 3) return t(`${en_vi}.medicine`);
				return "";
			}
		},
		{
			title: t(`${en_vi}.isCompleted`),
			dataIndex: "bizStatus",
			render: (bizType: any) => {
				if (bizType == 0) return t(`${en_vi}.incomplete`);
				if (bizType == 1) return t(`${en_vi}.completed`);
				return "";
			}
		},
		{
			title: t(`erp.warehouseGroupType.operations`),
			fixed: "right",
			width: 200,
			render: (_: any, record: any) => {
				return (
					<TableAction
						actions={[
							{
								icon: IconEnum.EDIT,
								label: t(`${en_vi}.details`),
								disabled: record.status == 1,
								onClick: details(record)
							}
						]}
					></TableAction>
				);
			}
		}
	];
	const [registerTable] = useTable({
		dataSource: data,
		columns,
		useSearchForm: false,
		bordered: true,
		beforeFetch: value => {
			console.log(value);
			return {
				...value,
				patCardno: information.patCardno
			};
		}
	});
	const [registerDrawer, { openDrawer }] = useDrawer();
	// const feesFn = (record: any) => async () => {
	// 	if (record.status == 1) {
	// 		const res = await chargeApi.chargeUpdate({
	// 			pkId: record.pkId,
	// 			status: 2
	// 		});
	// 		if (!res) return message.error(t(`${en_vi}.refundFailed`));
	// 		message.success(t(`${en_vi}.refundSuccessful`));
	// 		reload();
	// 		return;
	// 	}
	// 	const res = await chargeApi.chargeUpdate({
	// 		pkId: record.pkId,
	// 		status: 1
	// 	});
	// 	if (!res) return message.error(t(`${en_vi}.paymentFailed`));
	// 	message.success(t(`${en_vi}.paymentSuccessful`));
	// 	reload();
	// };
	const details = (record: any) => () => {
		openDrawer(true, {
			information,
			record,
			getChargeList
		});
	};
	const patientInfoSuccess = (value: any) => {
		setInformation(value);
	};
	const getChargeList = async () => {
		const res = await chargeApi.chargeList({
			patCardno: information.patCardno
		});
		setData(res.list);
	};
	useEffect(() => {
		// if (!information.patientId) return;
		getChargeList();
	}, [information.patientId]);
	return (
		<div className="charge">
			<div className="page-content">
				<div className="block">
					<PatientInformation successFn={patientInfoSuccess} />
				</div>
			</div>
			<div className="page-content charge_table">
				<Details register={registerDrawer}></Details>
				<BasicTable register={registerTable}></BasicTable>
			</div>
		</div>
	);
};

export default index;
